﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<PhysicalEquation.Models.EquationDetailModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Equation's detail
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <% Html.EnableClientValidation(); %>

    <%--<%:Html.ActionLink(Model.EquationItem.SubjectName, "index", "Equation", new { subjectId = Model.EquationItem.SubjectId }, null)%>--%>
    <div>
        <img src="../../Content/Images/BackButton.png" alt="add new equation" title="back" id="backImg" class="addItemButton">
            <%:Html.ActionLink("Back to " + Model.EquationItem.SubjectName, "index", "Equation", new { subjectId = Model.EquationItem.SubjectId }, null)%> 
        </img>
    </div>
    <div>
        <span style="font-size: 1.75em;"><%=Model.EquationItem.Number %>: &nbsp;<%=Model.EquationItem.Name %></span>
    </div>
    <br/>
    <span class="QuestionLabel">Question:</span>
    <br/>
    <span class="QuestionText"><%=Model.EquationItem.Comments %></span>
    <br/>
    <br/>
    <span>Answers:</span>
    <br/>

    <table id="equationDetailsTable">
        <%foreach(var answer in Model.Answers){%>
        <tr>
            <td><%:answer.Points%></td>
            <td><%:answer.UserName%></td>
            <td><%:answer.Answer%></td>
        </tr>
        <%} %>
    </table>
    <a id="showAnswersContainer" href="#">add answer</a>
    <div id="answerContainer" style="display: none;">
        <div>
            <%using (Ajax.BeginForm("AddEquationDetail", "Equation", new AjaxOptions()
                                                                {
                                                                    HttpMethod = "POST",
                                                                    InsertionMode = InsertionMode.InsertAfter,
                                                                    UpdateTargetId = "equationDetailsTable",
                                                                    OnSuccess = "_onSuccess",
                                                                    OnComplete = "_onComplete"
                                                                }))
                {%>
                <% Html.RenderPartial("AddEquationDetailView", new PhysicalEquation.Models.EquationItemDetailModel() {Answer = String.Empty, EquationId = Model.EquationItem.Id }); %>
                <% }%>
        </div>
        <div>
            <input type="button" value="ok" id="addNewEquationDetailButton"/> 
        </div>
    </div>
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="FeaturedContent" runat="server">
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="ScriptsSection" runat="server">
    <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            $("#showAnswersContainer").click(function () {
                if ($("#answerContainer").is(":visible")) {
                    $("#answerContainer").hide("blind", null, 500, function () {
                        $("#showAnswersContainer").html('add answer');
                    });
                } else {
                    $("#answerContainer").show("blind", null, 500, function () {
                        $("#showAnswersContainer").html('hide');
                    });
                }
            });
            $("#addNewEquationDetailButton").click(function () {
                $.validator.unobtrusive.parse(document);
                $("#addNewEquationDetailSubmit").click();
            });
        });
        
        var _onSuccess = function () {
            $('form').clearForm();
        };

        var _onComplete = function() {
            //$('form').clearForm();
        };
    </script>
</asp:Content>
